import Tutorial from "./tutorial";
import Travel, {
  ChangeTravel,
  InputTravel,
  ClickTravel,
  WheelTravel,
  MouseTravel
} from "./travel";
import Replay from './replay';
import Subscribe from "./subscribe";
import dayjs from "dayjs";
import {
  saveToStorage,
  getReplayData
} from "./utils";

import config from "./config";

let travelMap = {
  change: ChangeTravel,
  input: InputTravel,
  click: ClickTravel,
  wheel: WheelTravel,
  mousemove: MouseTravel
};

// 尽早运行可以在引入标签做async优化，
// 或者绑定到DOMContentLoad,
// 甚至可以直接写一个自执行函数，
// 这边采用绑定到onload上，放弃在资源加载完成前的操作
window.addEventListener('load', function () {

  getReplayData(config.CACHE_NAME).then((data) => {
    var lookBack = new Replay(data).play();
  });


  let tutorial = new Tutorial();
  let subscribe = new Subscribe();
  let curTravel = null;
  let pipes = [];
  let tmpPipes = [];
  tutorial.subscribe.subscribe('click', function ({
    type,
    event,
    triggerTime
  }) {
    let time = dayjs(triggerTime).format('YYYY-MM-DD HH:mm:ss');
    subscribe.publish('travel', {
      type,
      event,
      time
    });
  });
  tutorial.subscribe.subscribe('input', function ({
    type,
    event,
    triggerTime
  }) {
    let time = dayjs(triggerTime).format('YYYY-MM-DD HH:mm:ss');
    subscribe.publish('travel', {
      type,
      event,
      time
    });
  });
  tutorial.subscribe.subscribe('change', function ({
    type,
    event,
    triggerTime
  }) {
    let time = dayjs(triggerTime).format('YYYY-MM-DD HH:mm:ss');
    subscribe.publish('travel', {
      type,
      event,
      time
    });
  });

  tutorial.subscribe.subscribe('wheel', function ({
    type,
    event,
    triggerTime
  }) {
    let time = dayjs(triggerTime).format('YYYY-MM-DD HH:mm:ss');
    subscribe.publish('travel', {
      type,
      event,
      time
    });
  });

  tutorial.subscribe.subscribe('mousewheel', function ({
    type,
    event,
    triggerTime
  }) {
    let time = dayjs(triggerTime).format('YYYY-MM-DD HH:mm:ss');
    subscribe.publish('travel', {
      type,
      event,
      time
    });
  });

  tutorial.subscribe.subscribe('scroll', function ({
    type,
    event,
    triggerTime
  }) {
    let time = dayjs(triggerTime).format('YYYY-MM-DD HH:mm:ss');
    subscribe.publish('travel', {
      type,
      event,
      time
    });
  });

  tutorial.subscribe.subscribe('mousemove', function ({
    type,
    event,
    triggerTime
  }) {
    let time = dayjs(triggerTime).format('YYYY-MM-DD HH:mm:ss');
    subscribe.publish('travel', {
      type,
      event,
      time
    });
  });

  subscribe.subscribe('travel', function (travelData) {
    let {
      type,
      time,
      event
    } = travelData;
    let TravelObj = travelMap[type] || Travel;
    curTravel = new TravelObj(travelData, curTravel);
    let data = curTravel.getData();
    if (pipes.length >= config.CACHE_SPLIT_LEN) {
      tmpPipes[tmpPipes.length] = data;
      saveToStorage(config.CACHE_NAME, pipes).then(() => {
        pipes.length = 0;
        pipes = pipes.concat(tmpPipes.slice(0, 101));
      });
    } else {
      pipes[pipes.length] = data;
    }
  });
});